﻿body {
    padding: 0;
    margin: 0;
    overflow: hidden;
    height: 100%;
    width: 100%;
    background-color: #000;
    color: #bbb;
}

body, div, span {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/*布局*/
#layout {
    position: absolute;
    width: auto;
    top: 60px;
    bottom: 40px;
    right: 0;
    left: 60px;
    overflow: hidden;
}

    #layout > div, #layout > div > div {
        position: absolute;
        background-color: rgb(31, 34, 42);
        overflow: hidden;
    }

#layoutMain {
    width: 75%;
    height: auto;
    top: 0;
    bottom: 0;
    left: 0;
}

    #layoutMain #layoutAsset {
        width: 20%;
        height: 50%;
        top: 0;
        left: 0;
        border-bottom: solid 10px #000;
        border-right: solid 10px #000;
    }

    #layoutMain #layoutMarket {
        width: 80%;
        height: 50%;
        top: 0;
        left: 20%;
        border-bottom: solid 10px #000;
    }

    #layoutMain #layoutOrder {
        width: 100%;
        height: 25%;
        top: 50%;
        left: 0;
        border-bottom: solid 10px #000;
    }

    #layoutMain #layoutPosition {
        width: 100%;
        height: 25%;
        top: 75%;
        left: 0;
    }

#layoutRight {
    width: 25%;
    height: auto;
    top: 0;
    bottom: 0;
    right: 0;
    border-left: solid 10px #000;
    border-right: solid 10px #000;
}

    #layoutRight #layoutMarketItem {
        width: 100%;
        height: 50%;
        top: 0;
        right: 0;
    }

        #layoutRight #layoutMarketItem #layoutChart, #layoutRight #layoutMarketItem #boxMarketItem {
            position: absolute;
            overflow: hidden;
        }

        #layoutRight #layoutMarketItem #layoutChart {
            width: 100%;
            height: auto;
            top:128px;
            bottom:0;
            left:0;
        }

    #layoutRight .layoutRightBottom {
        width: 100%;
        height: 50%;
        top: 50%;
        right: 0;
    }

        #layoutRight .layoutRightBottom > div {
            position: absolute;
            overflow: hidden;
        }


        #layoutRight .layoutRightBottom #layoutGoods {
            width: 100%;
            height: 100%;
            top: 0;
            right: 0;
        }

        
#listMarket .chart {
    padding:0 10px;
    display:none;
    cursor:pointer;
}

@media (max-width:1500px) {
    #layoutRight {
        display: none;
    }

    #layoutMain {
        width: 100%;
    }

    #listMarket .chart {
        display: table-cell;
    }

    #layoutChart {
        height:300px;
    }
}

@media (max-width:991px) {
    .main {
        position: inherit;
    }

    .navbar .navbar-header .navbar-brand {
        margin-left: inherit;
    }

    .mm-menu.mm-offcanvas {
        display: inherit;
    }

    .mm-menu > .mm-panel {
        overflow: inherit;
        overflow-x: inherit;
        overflow-y: inherit;
    }

    .sidebar {
        padding-top: 50px;
        z-index: 10;
    }
}
/*布局结束*/

/*默认*/
.panel {
    background-color: rgba(0,0,0,0);
    -webkit-box-shadow: 0 0 0 rgba(0,0,0,0);
    -moz-box-shadow: 0 0 0 rgba(0,0,0,0);
    box-shadow: 0 0 0 rgba(0,0,0,0);
}

    .panel .panel-heading i {
        color: inherit;
    }


    .panel .panel-heading .panel-actions {
        height: auto;
        font-size: inherit;
    }

        .panel .panel-heading .panel-actions a {
            height: auto;
            width: auto;
        }

.panel-heading .nav-tabs li a {
    color: inherit;
   height: 30px; 
}

.panel-default > .panel-heading {
    background-color: rgba(0,0,0,.2);
    line-height: 30px;
    padding: 0 15px;
    min-height: 30px;
}

#layoutMain .panel-body {
    height: auto;
    position:absolute;
    top: 30px;
    bottom: 0;
    right: 0;
    left: 0;
}

.pancel-goods {
    font-size: 18px;
    text-align: center;
}

table.table {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

.table thead > tr > th {
    border-bottom: 1px solid rgba(0,0,0,.2);
}

.table thead > tr > th, .table tbody > tr > th, .table tfoot > tr > th, .table thead > tr > td, .table tbody > tr > td, .table tfoot > tr > td {
    padding: 5px;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: rgba(0,0,0,.1);
}

.table-select tbody > tr.selected td {
    background-color: rgba(0,0,0,0);
    background: -moz-linear-gradient(top,rgba(111, 126, 135, 0.6) 0,rgba(87, 86, 110, 0.6) 100%);
    background: -webkit-linear-gradient(top,rgba(111, 126, 135, 0.6) 0,rgba(87, 86, 110, 0.6) 100%);
    background: -o-linear-gradient(top,rgba(111, 126, 135, 0.6) 0,rgba(87, 86, 110, 0.6) 100%);
    background: -ms-linear-gradient(top,rgba(111, 126, 135, 0.6) 0,rgba(87, 86, 110, 0.6) 100%);
    background: linear-gradient(to bottom,rgba(111, 126, 135, 0.6) 0,rgba(87, 86, 110, 0.6) 100%);
}


.table-hover > tbody > tr:hover {
    background-color: rgba(255,255,255,.1);
}


.table thead th {
    text-align: center;
}

.tablelist tbody td {
    background-color: rgba(0,0,0,.2);
}

.table thead > tr > th {
    background-color: #32353D;
    color: #ccc;
}

.modal-header {
    border-bottom: 1px solid rgba(255,255,255,.1);
}

.modal-content {
    background-color: #272B32;
}

.modal-footer {
    border-top: 1px solid rgba(255,255,255,.1);
}
.nav-tabs > li > a {
    padding: 5px 15px;
}
.nav-tabs {
    border-bottom: 1px solid rgba(255,255,255,.1);
}

    .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li > a:hover {
        color: inherit;
        background-color: rgba(60, 63, 69, 1);
        border: 1px solid rgba(60, 63, 69, 1);
    }

    .nav-tabs > li > a {
        color: inherit;
    }

.panel-heading .nav-tabs li.active > a {
    /*background: #DF6C0B;*/
    -moz-box-shadow: -4px 0 0 rgba(0,0,0,.4);
  -webkit-box-shadow: -4px 0 0 rgba(0,0,0,.4);
  box-shadow: -4px 0 0 rgba(0,0,0,.4);
  background: -moz-linear-gradient(45deg,rgba(192,69,1,1) 0,rgba(215,124,17,1) 92%);
  background: -webkit-linear-gradient(45deg,rgba(192,69,1,1) 0,rgba(215,124,17,1) 92%);
  background: -o-linear-gradient(45deg,rgba(192,69,1,1) 0,rgba(215,124,17,1) 92%);
  background: linear-gradient(45deg,rgba(192,69,1,1) 0,rgba(215,124,17,1) 92%);
  color: #fff;
  border-left: #fda039 2px solid;
}

hr {
    border-top: 1px solid rgba(255,255,255,.1);
}

.btn.actions {
    color: #999;
}

    .btn.actions:hover {
        color: #ccc;
    }

.close {
    color: #999;
    opacity: 1;
}

    .close:hover {
        color: #fff;
        opacity: 1;
    }

.sidebar-header {
    display:none;
}
/*默认结束*/

.tradePrice .title {
    color: #999;
}

.tradePrice .number {
    font-size: 24px;
}

.condition-set .number {
    background-color: #fff;
    color: inherit;
    padding-left: 20px;
    padding-right: 20px;
}

.condition-set .unit {
    background-color: #fff;
    font-weight: bold;
    color: inherit;
}

.no-padding {
    padding: 0;
}

.positionQty-feedback {
    left: 110px;
    display: none;
}

.top-padding {
    padding-top: 15px;
}

.order-success .text-success {
    font-size: 24px;
}

    .order-success .text-success i {
        font-size: 32px;
    }

.order-success div.row {
    padding-bottom: 8px;
}

    .order-success div.row:first-child {
        text-align: center;
        padding-bottom: 15px;
    }

    .order-success div.row:not(:first-child) div:first-child {
        color: #666;
    }

    .order-success div.row:not(:first-child) div:last-child {
        font-size: 16px;
        font-weight: bold;
        text-align: right;
    }

#layoutAsset table th {
    text-align: right;
}

#layoutAsset table td {
    text-align: right;
    padding-right: 20px;
}

span.btn {
    margin: 0;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    border-radius: 3px;
    padding: 2px 5px 2px 5px;
    min-width: 20px;
    line-height: normal;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    border: 1px solid #444;
    color: #ddd;
    font-weight: bold;
    background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#444),color-stop(100%,#353535));
    background: -webkit-linear-gradient(top,#444 0,#353535 100%);
    background: linear-gradient(to bottom,#444 0,#353535 100%);
}

    span.btn:hover {
        color: white !important;
        text-shadow: inset 0 0 0 #ea8600 !important;
        background: #e5993b !important;
        background: -moz-linear-gradient(top,#dd8233 0,#e06c00 100%) !important;
        background: -webkit-linear-gradient(top,#dd8233 0,#e06c00 100%) !important;
        background: -o-linear-gradient(top,#dd8233 0,#e06c00 100%) !important;
        background: linear-gradient(to bottom,#dd8233 0,#e06c00 100%) !important;
    }

    span.btn.sellPrice:hover {
        color: white !important;
        text-shadow: inset 0 0 0 #ea8600 !important;
        background: #00d200 !important;
        background: -moz-linear-gradient(top,#4dbd74 0,#31a158 100%) !important;
        background: -webkit-linear-gradient(top,#4dbd74 0,#31a158 100%) !important;
        background: -o-linear-gradient(top,#4dbd74 0,#31a158 100%) !important;
        background: linear-gradient(to bottom,#4dbd74 0,#31a158 100%) !important;
    }

    span.btn.buyPrice:hover {
        color: white !important;
        text-shadow: inset 0 0 0 #ea8600 !important;
        background: #00d200 !important;
        background: -moz-linear-gradient(top,#f86c6b 0,#db504f 100%) !important;
        background: -webkit-linear-gradient(top,#f86c6b 0,#db504f 100%) !important;
        background: -o-linear-gradient(top,#f86c6b 0,#db504f 100%) !important;
        background: linear-gradient(to bottom,#f86c6b 0,#db504f 100%) !important;
    }

.light {
    color: white !important;
    text-shadow: inset 0 0 0 #ea8600 !important;
    background: #e5993b !important;
    background: -moz-linear-gradient(top,#32353D 0,#444852 100%) !important;
    background: -webkit-linear-gradient(top,#32353D 0,#444852 100%) !important;
    background: -o-linear-gradient(top,#32353D 0,#444852 100%) !important;
    background: linear-gradient(to bottom,#32353D 0,#444852 100%) !important;
}

#listMarket .light {
    color: white !important;
    text-shadow: inset 0 0 0 #ea8600 !important;
    background: #e5993b !important;
    background: -moz-linear-gradient(top,#dd8233 0,#e06c00 100%) !important;
    background: -webkit-linear-gradient(top,#dd8233 0,#e06c00 100%) !important;
    background: -o-linear-gradient(top,#dd8233 0,#e06c00 100%) !important;
    background: linear-gradient(to bottom,#dd8233 0,#e06c00 100%) !important;
}

.up, span.up {
    color: #00d200;
}

.dn, span.dn {
    color: #f60000;
}
